virtual DOM
実際にDOM生成を行う前にメモリ上で理想的なDOM状態を表現するための仕組み
内部構造はどんな表現でもいいが、最終的にブラウザのDOMと対応するようなデータ構造を持つため、ツリー構造を持つ
JavaScriptでの実装が一般的なため、結果的にJavaScriptオブジェクトとして表現されることが多い
例 from https://jasonformat.com/wtf-is-jsx/
code:json
{
nodeName: "div",
attributes: {
"id": "foo"
},
children: "Hello!"
}
ブラウザでレンダリングするためには、これをDOMに変換する
2020年版: なぜ仮想 DOM / 宣言的 UI という概念が、あのときの俺達の魂を震えさせたのか | Zenn